<template>
  <t-dialog
    :header="header"
    :visible.sync="visible"
    :onClose="closeDialog"
    :closeOnOverlayClick="false"
    :confirm="null"
    width="70%"
    top="5%"
  >
    <div style="height: 65vh">
      <t-form ref="form" :colon="true" label-align="top" :data="formData" labelWidth="100px" :rules="rules">
        <t-form-item label="系统名称" name="name">
          <t-input clearable style="width: 390px" v-model="formData.name" placeholder="请输入系统名称"></t-input>
        </t-form-item>
        <t-form-item label="系统登录名" name="userName">
          <t-input clearable style="width: 390px" v-model="formData.userName" placeholder="请输入系统登录名"></t-input>
        </t-form-item>
        <t-form-item label="系统密码" name="passWord">
          <t-input clearable type="password" style="width: 390px" v-model="formData.passWord" placeholder="请输入系统密码"></t-input>
        </t-form-item>
        <t-form-item layout="inline" label="" >

            <t-form-item label="建设年月" name="liaisonDate">
              <t-date-picker clearable mode="month" v-model="formData.liaisonDate"></t-date-picker>
            </t-form-item>

            <t-form-item label="完成时间" name="completeDate">
              <t-date-picker clearable mode="month" v-model="formData.completeDate"></t-date-picker>
            </t-form-item>

        </t-form-item>
        <t-form-item label="系统状态" name="systemStatus">
          <t-radio-group :options="dict.type.system_status" v-model="formData.systemStatus"></t-radio-group>
        </t-form-item>
        <t-form-item :show-error-message="false" label="应用主办处室" name="hostDepts">
          <t-table
            rowKey="id"
            :data="formData.hostDepts"
            :columns="columns1"
            :selected-row-keys="selectedRowKeys1"
            @select-change="(val)=>{selectedRowKeys1=val}"
            hover
          >
            <template #deptName="{row}">
              <t-tree-select  :status="row.deptNameStatus"  @change="(value,content) =>{hostDeptChange(value,content, row)}"   clearable filterable
                              :treeProps="{keys: {value: 'label'}}" v-model="row.deptName" :data="deptOptions"
                              placeholder="选择单位">
                <div slot="tips" v-if="row.deptNameStatus==='error'">不能为空</div>
              </t-tree-select>
            </template>
            <template #note="{row}">
              <t-textarea :autosize="{minRows: 3}"
                          v-model="row.note"/>
            </template>
          </t-table>
        </t-form-item>
        <div style="margin-top: 10px" class="btn-group-inline">
          <t-button @click="addData(1)">新增</t-button>
          <t-button @click="upData(1)">上移</t-button>
          <t-button @click="downData(1)">下移</t-button>
          <t-button @click="delData(1)">删除</t-button>
        </div>
        <t-form-item :show-error-message="false" label="应用责任单位" name="dutyDepts">
          <t-table
            rowKey="id"
            :data="formData.dutyDepts"
            :columns="columns2"
            :selected-row-keys="selectedRowKeys2"
            @select-change="(val)=>{selectedRowKeys2=val}"
            hover
          >
            <template #deptName="{row}">
              <t-tree-select :status="row.deptNameStatus"  @change="dutyDeptChange"  v-if="row.isInnerCompany==='1'"  clearable filterable
                              :treeProps="{keys: {value: 'label'}}" v-model="row.deptName" :data="deptOptions"
                              placeholder="选择单位">
                <template #label>
                  <t-switch
                    size="medium"
                    v-model="row.isInnerCompany"
                    :label="['内部', '外部']"
                    :customValue="['1', '0']"
                    @change="()=>{row.deptName='';row.managerId=null}"
                  ></t-switch>
                </template>
                <div slot="tips" v-if="row.deptNameStatus==='error'">不能为空</div>
              </t-tree-select>
              <t-select
                v-else
                v-model="row.deptName"
                creatable
                filterable
                placeholder="请输入"
                :loading="companyLoading"
                @search="remoteCompanyMethod"
                :options="companyOptions"
                @create="createCompanyOptions"
                :status="row.deptNameStatus"
                @change="()=>{ if(row.deptName!==''){row.deptNameStatus='default'} }"

              >
                <template #label>
                  <t-switch
                    size="medium"
                    v-model="row.isInnerCompany"
                    :label="['内部', '外部']"
                    :customValue="['1', '0']"
                    @change="()=>{row.company='';row.managerId=null}"
                  ></t-switch>
                </template>
                <div slot="tips" v-if="row.deptNameStatus==='error'">不能为空</div>
              </t-select>
            </template>
            <template #note="{row}">
              <t-textarea :autosize="{minRows: 3}"
                          v-model="row.note"/>
            </template>
          </t-table>
        </t-form-item>
        <div style="margin-top: 10px" class="btn-group-inline">
          <t-button @click="addData(2)">新增</t-button>
          <t-button @click="upData(2)">上移</t-button>
          <t-button @click="downData(2)">下移</t-button>
          <t-button @click="delData(2)">删除</t-button>
        </div>
        <t-form-item :show-error-message="false" label="应用联系人" name="aboutMembers1">
          <t-table
            rowKey="id"
            :data="formData.aboutMembers1"
            :columns="columns3"
            :selected-row-keys="selectedRowKeys3"
            @select-change="(val)=>{selectedRowKeys3=val}"
            hover
          >
            <template #name="{row}">
              <t-input :status="row.nameStatus" @change="()=>{ if(row.name!==''){row.nameStatus='default'} }"  v-model="row.name" clearable>
                <div slot="tips" v-if="row.nameStatus==='error'">不能为空</div>
              </t-input>
            </template>
            <template #note="{row}">
              <t-textarea :autosize="{minRows: 3}"
                          v-model="row.note"/>
            </template>
          </t-table>
        </t-form-item>
        <div style="margin-top: 10px" class="btn-group-inline">
          <t-button @click="addData(3)">新增</t-button>
          <t-button @click="upData(3)">上移</t-button>
          <t-button @click="downData(3)">下移</t-button>
          <t-button @click="delData(3)">删除</t-button>
        </div>
        <t-form-item :show-error-message="false" label="建设责任单位" name="constructionDepts">
          <t-table
            rowKey="id"
            :data="formData.constructionDepts"
            :columns="columns4"
            :selected-row-keys="selectedRowKeys4"
            @select-change="(val)=>{selectedRowKeys4=val}"
            hover
          >
            <template #deptName="{row}">
              <t-tree-select :status="row.deptNameStatus" @change="(value,content) =>{constructionDeptChange(value,content, row)}"   clearable filterable
                              :treeProps="{keys: {value: 'label'}}" v-model="row.deptName" :data="deptOptions"
                              placeholder="选择单位">
                <div slot="tips" v-if="row.deptNameStatus==='error'">不能为空</div>
              </t-tree-select>
            </template>
            <template #note="{row}">
              <t-textarea :autosize="{minRows: 3}"
                          v-model="row.note"/>
            </template>
          </t-table>
        </t-form-item>
        <div style="margin-top: 10px" class="btn-group-inline">
          <t-button @click="addData(4)">新增</t-button>
          <t-button @click="upData(4)">上移</t-button>
          <t-button @click="downData(4)">下移</t-button>
          <t-button @click="delData(4)">删除</t-button>
        </div>
        <t-form-item :show-error-message="false" label="建设责任人/联络员" name="aboutMembers2">
          <t-table
            rowKey="id"
            :data="formData.aboutMembers2"
            :columns="columns5"
            :selected-row-keys="selectedRowKeys5"
            @select-change="(val)=>{selectedRowKeys5=val}"
            hover
          >
            <template #name="{row}">
              <t-input :status="row.nameStatus" @change="()=>{ if(row.name!==''){row.nameStatus='default'} }"  v-model="row.name" clearable>
                <div slot="tips" v-if="row.nameStatus==='error'">不能为空</div>
              </t-input>
            </template>
            <template #memberType="{row}">
                <t-select v-model="row.memberType" :options="dict.type.yxjk_member_type.filter(val=>{return  val.value!=='1'})"></t-select>
            </template>
            <template #note="{row}">
              <t-textarea :autosize="{minRows: 3}"
                          v-model="row.note"/>
            </template>
          </t-table>
        </t-form-item>
        <div style="margin-top: 10px" class="btn-group-inline">
          <t-button @click="addData(5)">新增</t-button>
          <t-button @click="upData(5)">上移</t-button>
          <t-button @click="downData(5)">下移</t-button>
          <t-button @click="delData(5)">删除</t-button>
        </div>

        <t-form-item label="备注" name="note">
          <t-textarea :autosize="{minRows: 5}"
                      v-model="formData.note"/>
        </t-form-item>
      </t-form>
    </div>
    <template #footer>
      <t-button :loading="submitLoading" theme="primary" @click="onSubmit(0)">暂存</t-button>
        <t-button :loading="submitLoading"   theme="primary" @click="onSubmit(1)">提交</t-button>
      <t-button theme="default" @click="closeDialog">取消</t-button>
    </template>
  </t-dialog>
</template>

<script>
export default {
  name: "add-edit-system",
  props: ['header', 'objId', 'parentId'],
  dicts:["yxjk_member_type","system_status"],
  data() {
    return {
      visible: true,
      submitLoading: false,
      companyLoading: false,
      companyOptions: [],
      deptOptions: [],
      selectedRowKeys1: [],
      selectedRowKeys2: [],
      selectedRowKeys3: [],
      selectedRowKeys4: [],
      selectedRowKeys5: [],
      columns1: [
        // {
        //   colKey: "sort",
        //   title: "序号",
        //   align: "center",
        // },
        {
          colKey: 'row-select',
          type: 'single',
          title: "选择",
          width: 64
        },
        {
          colKey: "deptName",
          title: "处室名称",
          align: "center",
          width: 390
        },
        {
          colKey: "note",
          title: "备注",
          align: "center",
        },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        // },
      ],
      columns2: [
        {
          colKey: 'row-select',
          type: 'single',
          title: "选择",
          width: 64
        },
        // {
        //   colKey: "sort",
        //   title: "序号",
        //   align: "center",
        // },
        {
          colKey: "deptName",
          title: "单位名称",
          align: "center",
          width: 390
        },
        {
          colKey: "note",
          title: "备注",
          align: "center",
        },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        // },
      ],
      columns3: [
        {
          colKey: 'row-select',
          type: 'single',
          title: "选择",
          width: 64
        },
        // {
        //   colKey: "sort",
        //   title: "序号",
        //   align: "center",
        // },
        {
          colKey: "name",
          title: "姓名",
          align: "center",
          width: 390
        },
        {
          colKey: "note",
          title: "备注",
          align: "center",
        },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        // },
      ],
      columns4: [
        {
          colKey: 'row-select',
          type: 'single',
          title: "选择",
          width: 64
        },
        // {
        //   colKey: "sort",
        //   title: "序号",
        //   align: "center",
        // },
        {
          colKey: "deptName",
          title: "单位名称",
          align: "center",
          width: 390
        },
        {
          colKey: "note",
          title: "备注",
          align: "center",
        },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        // },
      ],
      columns5: [
        {
          colKey: 'row-select',
          type: 'single',
          title: "选择",
          width: 64
        },
        // {
        //   colKey: "sort",
        //   title: "序号",
        //   align: "center",
        // },
        {
          colKey: "name",
          title: "姓名",
          align: "center",
          width: 390
        },
        {
          colKey: "memberType",
          title: "人员类型",
          align: "center",
        },
        {
          colKey: "note",
          title: "备注",
          align: "center",
        },
        // {
        //   colKey: "createTime",
        //   title: "创建时间",
        //   align: "center",
        // },
      ],
      formData: {
        name: '',
        userName: '',
        passWord: '',
        liaisonDate: '',
        completeDate: '',
        note: '',
        aboutMembers1: [],
        aboutMembers2: [],
        aboutMembers: [],
        dutyDepts: [],
        hostDepts: [],
        constructionDepts: [],
        systemStatus: '1',
      },
      rules: {
        name: [
          {required: true, message: "系统名称不能为空"}
        ],
        userName: [
          {required: true, message: "系统登录名不能为空"}
        ],
        passWord: [
          {required: true, message: "系统密码不能为空"}
        ],
        systemStatus: [
          {required: true, message: "系统状态不能为空", trigger:'blur'}
        ],
        liaisonDate: [
          {required: true, message: "建设年月不能为空"}
        ],
        hostDepts: [{required: true, validator: (val) => val && val.length, message: "应用主办处室不能为空"}],
        dutyDepts: [{required: true, validator: (val) => val && val.length, message: "应用责任单位不能为空"}],
        aboutMembers1: [{required: true, validator: (val) => val && val.length, message: "应用联系人不能为空"}],
        constructionDepts: [{required: true, validator: (val) => val && val.length, message: "建设责任单位不能为空"}],
        aboutMembers2: [{required: true, validator: (val) => val && val.length, message: "建设责任人/联络员不能为空"}]

      }
    }
  },
  watch: {
    objId: {
      immediate: true,
      handler(val) {
        if (val) {
          this.getObj();
        }
      }
    },
  },
  created() {
    if (!this.objId) {
      Promise.all([this.getDeptTreeSelect()]);
    }
  },
  methods: {
    checkData(){
      // 合作单位 非空判断
      const isValidate = this.formData.hostDepts.every((val, index) => {
        if (!val.deptName) {
          this.$set(this.formData.hostDepts[index], 'deptNameStatus', 'error')
          this.$message.error(`应用主办处室：第${index + 1}条"处室名称"不能为空`);
          return false;
        }
        this.$set(this.formData.hostDepts[index], 'deptNameStatus', 'default')
        return true;
      });
      if(!isValidate){
        return isValidate
      }
      const isValidate2 = this.formData.dutyDepts.every((val, index) => {
        if (!val.deptName) {
          this.$set(this.formData.dutyDepts[index], 'deptNameStatus', 'error')
          this.$message.error(`应用责任单位：第${index + 1}条"单位名称"不能为空`);
          return false;
        }
        this.$set(this.formData.dutyDepts[index], 'deptNameStatus', 'default')
        return true;
      });
      if(!isValidate2){
        return isValidate2
      }
      const isValidate3 = this.formData.aboutMembers1.every((val, index) => {
        if (!val.name) {
          this.$set(this.formData.aboutMembers1[index], 'nameStatus', 'error')
          this.$message.error(`应用联系人：第${index + 1}条"姓名"不能为空`);
          return false;
        }
        this.$set(this.formData.aboutMembers1[index], 'nameStatus', 'default')
        return true;
      });
      if(!isValidate3){
        return isValidate3
      }
      const isValidate4 = this.formData.constructionDepts.every((val, index) => {
        if (!val.deptName) {
          this.$set(this.formData.constructionDepts[index], 'deptNameStatus', 'error')
          this.$message.error(`建设责任单位：第${index + 1}条"单位名称"不能为空`);
          return false;
        }
        this.$set(this.formData.constructionDepts[index], 'deptNameStatus', 'default')
        return true;
      });
      if(!isValidate4){
        return isValidate4
      }
      const isValidate5 = this.formData.aboutMembers2.every((val, index) => {
        if (!val.name) {
          this.$set(this.formData.aboutMembers2[index], 'nameStatus', 'error')
          this.$message.error(`建设责任人/联络员：第${index + 1}条"姓名"不能为空`);
          return false;
        }
        this.$set(this.formData.aboutMembers2[index], 'nameStatus', 'default')
        return true;
      });
      return isValidate5;
    },
    createCompanyOptions(value){
      this.companyOptions.push({
        label:`${value}`,
        value,
      });
    },
    remoteCompanyMethod(search){
      this.companyLoading = true;
      this.$api.system.dept.selectAllOutDeptList({deptName:search}).then(response => {
        this.companyOptions = response.data.map(val=>  ({
          ...val,
          label:`${val.deptName}`,
          value:val.deptName,
        }));
        this.companyLoading = false;
      }).catch((e) => {
        this.companyLoading = false;
        this.$message.error(e.toString());
      });
    },
    constructionDeptChange(value,content,row){
      row.managerId = content.data.id;
      if(row.deptName!==''){row.deptNameStatus='default'}
    },
    hostDeptChange(value,content,row){
      row.managerId = content.data.id;
      if(row.deptName!==''){row.deptNameStatus='default'}
    },
    dutyDeptChange(value,content,row){
      row.managerId = content.data.id;
      if(row.deptName!==''){row.deptNameStatus='default'}
    },
    async getObj() {
      await Promise.all([this.getDeptTreeSelect()]);
      this.$api.yxjk.system.get(this.objId).then(response => {
        Object.assign(this.formData, response.data)
        this.formData.aboutMembers1 = this.formData.aboutMembers.filter(val => val.memberType === '1')
        this.formData.aboutMembers2 = this.formData.aboutMembers.filter(val => val.memberType !== '1')
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    getDeptTreeSelect(id) {
      return this.$api.system.dept.treeSelectAllIn().then(response => {
        this.deptOptions = response.data;
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    closeDialog() {
      this.$emit("update:visible", false);
    },
    onSubmit(type) {
      this.submitLoading = true;
      if(type===0){
        this.$refs.form.validate({
          fields: ['name']
        }).then((validateResult) => {
          if (validateResult === true) {
            // 赋值sort
            this.formData.aboutMembers1 = this.formData.aboutMembers1.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.aboutMembers2 = this.formData.aboutMembers2.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.constructionDepts = this.formData.constructionDepts.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.dutyDepts = this.formData.dutyDepts.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.hostDepts = this.formData.hostDepts.map((val, index) => ({sort: index + 1, ...val}))
            // 合并member
            this.formData.aboutMembers = this.formData.aboutMembers1.concat(this.formData.aboutMembers2)
            if (this.objId) {
              this.$api.yxjk.system.update(this.formData).then(() => {
                this.$message.success("暂存成功");
                this.submitLoading = false;
                this.$emit("reload");
                this.$emit("update:visible", false);
              }).catch((e) => {
                this.submitLoading = false;
                this.$message.error(e.toString());
              });
            } else {
              this.$api.yxjk.system.add(this.formData).then((response) => {
                this.$message.success("新增成功");
                this.submitLoading = false;
                this.$emit("reload");
                this.$emit("update:visible", false);
              }).catch((e) => {
                this.submitLoading = false;
                this.$message.error(e.toString());
              });
            }
          } else {
            const firstError = Object.values(validateResult)[0]?.[0]?.message;
            this.$message.error(firstError);
            this.submitLoading = false;
          }
        });

      }else {
        const isValidate = this.checkData()
        if(!isValidate){
          this.submitLoading = false;
          return false;
        }
        this.$refs.form.validate().then((validateResult) => {
          if (validateResult === true) {
            // 赋值sort
            this.formData.aboutMembers1 = this.formData.aboutMembers1.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.aboutMembers2 = this.formData.aboutMembers2.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.constructionDepts = this.formData.constructionDepts.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.dutyDepts = this.formData.dutyDepts.map((val, index) => ({sort: index + 1, ...val}))
            this.formData.hostDepts = this.formData.hostDepts.map((val, index) => ({sort: index + 1, ...val}))
            // 合并member
            this.formData.aboutMembers = this.formData.aboutMembers1.concat(this.formData.aboutMembers2)
            if (this.objId) {
              this.$api.yxjk.system.update(this.formData).then(() => {
                this.$message.success("修改成功");
                this.submitLoading = false;
                this.$emit("reload");
                this.$emit("update:visible", false);
              }).catch((e) => {
                this.submitLoading = false;
                this.$message.error(e.toString());
              });
            } else {
              this.$api.yxjk.system.add(this.formData).then((response) => {
                this.$message.success("新增成功");
                this.submitLoading = false;
                this.$emit("reload");
                this.$emit("update:visible", false);
              }).catch((e) => {
                this.submitLoading = false;
                this.$message.error(e.toString());
              });
            }
          }else {
            const firstError = Object.values(validateResult)[0]?.[0]?.message;
            this.$message.error(firstError);
            this.submitLoading = false;
          }
        });
      }

    },
    addData(type) {
      const newId = Number(new Date().getTime()) + Number(Math.random() * 10)
      if (type === 1) {
        this.formData.hostDepts.push({
          id: newId,
          deptName: '',
          managerId: null,
          note: '',
        })
      } else if (type === 2) {
        this.formData.dutyDepts.push({
          id: newId,
          deptName: '',
          managerId: null,
          note: '',
          isInnerCompany: '1'
        })
      } else if (type === 3) {
        this.formData.aboutMembers1.push({
          id: newId,
          name: '',
          memberType: '1',
          note: '',
        })
      } else if (type === 4) {
        this.formData.constructionDepts.push({
          id: newId,
          name: '',
          deptName: '',
          managerId: null,
          note: '',
        })
      } else if (type === 5) {
        this.formData.aboutMembers2.push({
          id: newId,
          name: '',
          memberType: '2',
          note: '',
        })
      }
    },
    upData(type) {
      if (type === 1) {
        if (this.selectedRowKeys1.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.hostDepts[0].id === this.selectedRowKeys1[0]) {
          this.$message.warning("已是第一行");
        } else {
          const index = this.formData.hostDepts.findIndex((val) => val.id === this.selectedRowKeys1[0])
          this.moveInArray(this.formData.hostDepts, index, index - 1)
        }
      } else if (type === 2) {
        if (this.selectedRowKeys2.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.dutyDepts[0].id === this.selectedRowKeys2[0]) {
          this.$message.warning("已是第一行");
        } else {
          const index = this.formData.dutyDepts.findIndex((val) => val.id === this.selectedRowKeys2[0])
          this.moveInArray(this.formData.dutyDepts, index, index - 1)
        }
      } else if (type === 3) {
        if (this.selectedRowKeys3.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.aboutMembers1[0].id === this.selectedRowKeys3[0]) {
          this.$message.warning("已是第一行");
        } else {
          const index = this.formData.aboutMembers1.findIndex((val) => val.id === this.selectedRowKeys3[0])
          this.moveInArray(this.formData.aboutMembers1, index, index - 1)
        }
      } else if (type === 4) {
        if (this.selectedRowKeys4.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.constructionDepts[0].id === this.selectedRowKeys4[0]) {
          this.$message.warning("已是第一行");
        } else {
          const index = this.formData.constructionDepts.findIndex((val) => val.id === this.selectedRowKeys4[0])
          this.moveInArray(this.formData.constructionDepts, index, index - 1)
        }
      } else if (type === 4) {
        if (this.selectedRowKeys5.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.aboutMembers1[0].id === this.selectedRowKeys5[0]) {
          this.$message.warning("已是第一行");
        } else {
          const index = this.formData.aboutMembers1.findIndex((val) => val.id === this.selectedRowKeys5[0])
          this.moveInArray(this.formData.aboutMembers1, index, index - 1)
        }
      }
    },
    downData(type) {
      if (type === 1) {
        if (this.selectedRowKeys1.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.hostDepts[this.formData.hostDepts.length - 1].id === this.selectedRowKeys1[0]) {
          this.$message.warning("已是最后一行");
        } else {
          const index = this.formData.hostDepts.findIndex((val) => val.id === this.selectedRowKeys1[0])
          this.moveInArray(this.formData.hostDepts, index, index + 1)
        }
      } else if (type === 2) {
        if (this.selectedRowKeys2.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.dutyDepts[this.formData.dutyDepts.length - 1].id === this.selectedRowKeys2[0]) {
          this.$message.warning("已是最后一行");
        } else {
          const index = this.formData.dutyDepts.findIndex((val) => val.id === this.selectedRowKeys2[0])
          this.moveInArray(this.formData.dutyDepts, index, index + 1)
        }
      } else if (type === 3) {
        if (this.selectedRowKeys3.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.aboutMembers1[this.formData.aboutMembers1.length - 1].id === this.selectedRowKeys3[0]) {
          this.$message.warning("已是最后一行");
        } else {
          const index = this.formData.aboutMembers1.findIndex((val) => val.id === this.selectedRowKeys3[0])
          this.moveInArray(this.formData.aboutMembers1, index, index + 1)
        }
      } else if (type === 4) {
        if (this.selectedRowKeys4.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.constructionDepts[this.formData.constructionDepts.length - 1].id === this.selectedRowKeys4[0]) {
          this.$message.warning("已是最后一行");
        } else {
          const index = this.formData.constructionDepts.findIndex((val) => val.id === this.selectedRowKeys4[0])
          this.moveInArray(this.formData.constructionDepts, index, index + 1)
        }
      } else if (type === 5) {
        if (this.selectedRowKeys5.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        if (this.formData.aboutMembers2[this.formData.aboutMembers2.length - 1].id === this.selectedRowKeys5[0]) {
          this.$message.warning("已是最后一行");
        } else {
          const index = this.formData.aboutMembers2.findIndex((val) => val.id === this.selectedRowKeys5[0])
          this.moveInArray(this.formData.aboutMembers2, index, index + 1)
        }
      }
    },
    delData(type) {
      if (type === 1) {
        if (this.selectedRowKeys1.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        const index = this.formData.hostDepts.findIndex((val) => val.id === this.selectedRowKeys1[0])
        this.formData.hostDepts.splice(index, 1)
        this.selectedRowKeys1 = [];
      } else if (type === 2) {
        if (this.selectedRowKeys2.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        const index = this.formData.dutyDepts.findIndex((val) => val.id === this.selectedRowKeys2[0])
        this.formData.dutyDepts.splice(index, 1)
        this.selectedRowKeys2 = [];
      } else if (type === 3) {
        if (this.selectedRowKeys3.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        const index = this.formData.aboutMembers1.findIndex((val) => val.id === this.selectedRowKeys3[0])
        this.formData.aboutMembers1.splice(index, 1)
        this.selectedRowKeys3 = [];
      } else if (type === 4) {
        if (this.selectedRowKeys4.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        const index = this.formData.constructionDepts.findIndex((val) => val.id === this.selectedRowKeys4[0])
        this.formData.constructionDepts.splice(index, 1)
        this.selectedRowKeys4 = [];
      } else if (type === 5) {
        if (this.selectedRowKeys5.length <= 0) {
          this.$message.warning("请选择一行");
          return;
        }
        const index = this.formData.aboutMembers2.findIndex((val) => val.id === this.selectedRowKeys5[0])
        this.formData.aboutMembers2.splice(index, 1)
        this.selectedRowKeys5 = [];
      }

    },
    moveInArray(arr, ffrom, to) {
      // 删除当前的位置
      const item = arr.splice(ffrom, 1);
      // 确保还剩有元素移动
      if (!item.length) {
        this.$message.warning(`There is no item in the array at index ${ffrom}`);
      }
      // 移动元素到指定位置
      arr.splice(to, 0, item[0]);
    },
  }
}
</script>

<style scoped>

</style>
